<template>
  <div>
    <e-table
      ref="eTable"
      @getList="handleGetList"
      :tableData="tableData"
      :columns="columns"
      :loading="loading"
    >
      <el-table-column show-overflow-tooltip slot="info" label="供应商" align="center">
        <span slot-scope="scope">
          <span>{{ scope.row.supplierName }}</span>
        </span>
      </el-table-column>
      <el-table-column slot="contact" label="关系人" align="center" width="150">
        <span slot-scope="scope">
          <span
            v-for="(item, index) in showList(scope.row.linkmanList)"
            :key="index"
            :salesMan="true"
          >{{ item.linkmanName }}</span>
        </span>
      </el-table-column>
      <el-table-column slot="creator" label="创建人" align="center" width="80">
        <span slot-scope="scope">{{ scope.row.createUser }}</span>
      </el-table-column>
      <el-table-column slot="action" fixed="right" label="操作" width="50" align="center">
        <template slot-scope="scope">
          <el-dropdown>
            <a class="el-dropdown-link">
              <i class="el-icon-menu"></i>
            </a>
            <el-dropdown-menu slot="dropdown">
              <!-- <el-dropdown-item @click.native="handleEdit(true, scope.row, true)">
                <a>查看</a>
              </el-dropdown-item>-->
              <el-dropdown-item @click.native="handleDetail(scope.row)">
                <a>详情</a>
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </e-table>
    <record-detail ref="recordDetail" />
  </div>
</template>

<script>
import { badSupplierList, handleBadRecord } from '@/api/supplier'
import { openNotification, getSession, setSession } from '@/utils/util'
import RecordDetail from '@/views/supplier/badrecord/RecordDetail'

export default {
  components: {
    RecordDetail
  },
  data() {
    return {
      selectedRows: [],
      queryParam: {
        pageNo: 1,
        pageSize: 10
      },
      loading: false,
      // 表头
      columns: [
        { slot: 'selection' },
        { slot: 'info' },
        {
          label: '不良类型',
          width: '150px',
          prop: 'badTypeName'
        },
        {
          label: '发生日期',
          width: '110px',
          prop: 'badDate'
        },
        { slot: 'contact' },
        { slot: 'creator' },
        {
          label: '处置结果',
          width: '100px',
          prop: 'handleStateName'
        },
        { slot: 'action' }
      ],
      tableData: [],
      total: 1
    }
  },
  mounted() {
    let mdl = {}
    const obj = this.$route.params.obj

    if (obj) {
      setSession('record', obj)
      mdl = obj
    } else {
      mdl = getSession('record')
    }
    this.handleGetList({ supplierCode: mdl.supplierCode })
  },
  methods: {
    showList(str) {
      if (str && str !== '[]') {
        return JSON.parse(str)
      }
    },
    // 编辑
    // handleEdit(bool, obj, view = false) {
    //   this.$nextTick(() => {
    //     this.$emit('edit', bool, obj, view)
    //   })
    // },
    handleDetail(row) {
      this.$refs.recordDetail.edit(row)
    },
    // 获取不良记录列表
    async handleGetList(param = {}) {
      this.loading = true
      const res = await badSupplierList({ ...this.queryParam, ...param })
      if (res && res.data.records.length > 0) {
        const {
          state,
          data: { records, total }
        } = res
        this.tableData = records
        this.total = total
      } else {
        this.tableData = []
        this.total = 1
      }
      this.loading = false
    }
  }
}
</script>

